﻿<!DOCTYPE html>
<html>
  <head>
    <title>单选按钮组 Radio Group</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=1440, user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <link href="resources/css/jquery-ui-themes.css" type="text/css" rel="stylesheet"/>
    <link href="resources/css/axure_rp_page.css" type="text/css" rel="stylesheet"/>
    <link href="data/styles.css" type="text/css" rel="stylesheet"/>
    <link href="files/______radio_group/styles.css" type="text/css" rel="stylesheet"/>
    <link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" type="text/css" rel="stylesheet"/>
    <script src="resources/scripts/jquery-1.7.1.min.js"></script>
    <script src="resources/scripts/jquery-ui-1.8.10.custom.min.js"></script>
    <script src="resources/scripts/prototypePre.js"></script>
    <script src="data/document.js"></script>
    <script src="resources/scripts/prototypePost.js"></script>
    <script src="files/______radio_group/data.js"></script>
    <script type="text/javascript">
      $axure.utils.getTransparentGifPath = function() { return 'resources/images/transparent.gif'; };
      $axure.utils.getOtherPath = function() { return 'resources/Other.html'; };
      $axure.utils.getReloadPath = function() { return 'resources/reload.html'; };
    </script>
  </head>
  <body>
    <div id="base" class="">

      <!-- Unnamed (Rectangle) -->
      <div id="u5527" class="ax_default _默认样式">
        <div id="u5527_div" class=""></div>
      </div>

      <!-- Unnamed (元件标题) -->

      <!-- 背景 (Dynamic Panel) -->
      <div id="u5529" class="ax_default" data-label="背景">
        <div id="u5529_state0" class="panel_state" data-label="State1" style="">
          <div id="u5529_state0_content" class="panel_state_content">
          </div>
        </div>
      </div>

      <!-- 线条 (Dynamic Panel) -->
      <div id="u5530" class="ax_default" data-label="线条">
        <div id="u5530_state0" class="panel_state" data-label="State1" style="">
          <div id="u5530_state0_content" class="panel_state_content">
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5531" class="ax_default _默认样式">
        <div id="u5531_div" class=""></div>
        <div id="u5531_text" class="text ">
          <p><span style="font-family:'FontAwesome Bold', 'FontAwesome Regular', 'FontAwesome';"></span><span style="font-family:'微软雅黑 Bold', '微软雅黑';"> 元件标题</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5532" class="ax_default _默认样式">
        <div id="u5532_div" class=""></div>
        <div id="u5532_text" class="text ">
          <p><span style="font-family:'FontAwesome';font-weight:400;"></span><span style="font-family:'微软雅黑';font-weight:400;"> </span><span style="font-family:'FontAwesome';font-weight:400;">作品首页</span></p>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5533" class="ax_default" data-left="20" data-top="100" data-width="1100" data-height="110">

        <!-- Unnamed (Rectangle) -->
        <div id="u5534" class="ax_default _默认样式">
          <div id="u5534_div" class=""></div>
          <div id="u5534_text" class="text ">
            <p style="font-size:14px;"><span style="font-family:'微软雅黑 Bold', '微软雅黑';font-weight:700;">使用说明</span></p><p style="font-size:12px;"><span style="font-family:'微软雅黑';font-weight:400;">单选按纽组可以取代单选框，使展示效果更加美观，也可以应用于标签栏或菜单切换等效果。按纽组具有同时只会选中一个按纽的特性，在设置按纽组时需要选中同组全部按纽，然后在属性或右击中设置选项组名称。同一个页面内，非同组按纽的选项组名不能重复，否则选中效果会错乱，也就是说一个页面内有多个按纽组，你需要单独对每个按钮组单独设置不同的名称。</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5535" class="ax_default _默认样式">
          <div id="u5535_div" class=""></div>
          <div id="u5535_text" class="text ">
            <p><span></span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5536" class="ax_default _默认样式">
        <div id="u5536_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5537" class="ax_default _默认样式">
        <div id="u5537_div" class=""></div>
        <div id="u5537_text" class="text ">
          <p><span>单选按纽组</span></p>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5538" class="ax_default" data-left="40" data-top="312" data-width="317" data-height="35">

        <!-- Unnamed (Rectangle) -->
        <div id="u5539" class="ax_default _默认样式 selected" selectiongroup="选项组1">
          <div id="u5539_div" class="selected"></div>
          <div id="u5539_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5540" class="ax_default _默认样式" selectiongroup="选项组1">
          <div id="u5540_div" class=""></div>
          <div id="u5540_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5541" class="ax_default _默认样式" selectiongroup="选项组1">
          <div id="u5541_div" class=""></div>
          <div id="u5541_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5542" class="ax_default _默认样式" selectiongroup="选项组1">
          <div id="u5542_div" class=""></div>
          <div id="u5542_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5543" class="ax_default" data-left="40" data-top="372" data-width="317" data-height="35">

        <!-- Unnamed (Rectangle) -->
        <div id="u5544" class="ax_default _默认样式 selected" selectiongroup="选项组2">
          <div id="u5544_div" class="selected"></div>
          <div id="u5544_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5545" class="ax_default _默认样式" selectiongroup="选项组2">
          <div id="u5545_div" class=""></div>
          <div id="u5545_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5546" class="ax_default _默认样式" selectiongroup="选项组2">
          <div id="u5546_div" class=""></div>
          <div id="u5546_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5547" class="ax_default _默认样式" selectiongroup="选项组2">
          <div id="u5547_div" class=""></div>
          <div id="u5547_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5548" class="ax_default _默认样式">
        <div id="u5548_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5549" class="ax_default _默认样式">
        <div id="u5549_div" class=""></div>
        <div id="u5549_text" class="text ">
          <p><span>按纽组尺寸</span></p>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5550" class="ax_default" data-left="600" data-top="307" data-width="317" data-height="45">

        <!-- Unnamed (Rectangle) -->
        <div id="u5551" class="ax_default _默认样式 selected" selectiongroup="选项组7">
          <div id="u5551_div" class="selected"></div>
          <div id="u5551_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5552" class="ax_default _默认样式" selectiongroup="选项组7">
          <div id="u5552_div" class=""></div>
          <div id="u5552_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5553" class="ax_default _默认样式" selectiongroup="选项组7">
          <div id="u5553_div" class=""></div>
          <div id="u5553_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5554" class="ax_default _默认样式" selectiongroup="选项组7">
          <div id="u5554_div" class=""></div>
          <div id="u5554_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5555" class="ax_default" data-left="600" data-top="372" data-width="280" data-height="35">

        <!-- Unnamed (Rectangle) -->
        <div id="u5556" class="ax_default _默认样式 selected" selectiongroup="选项组8">
          <div id="u5556_div" class="selected"></div>
          <div id="u5556_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5557" class="ax_default _默认样式" selectiongroup="选项组8">
          <div id="u5557_div" class=""></div>
          <div id="u5557_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5558" class="ax_default _默认样式" selectiongroup="选项组8">
          <div id="u5558_div" class=""></div>
          <div id="u5558_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5559" class="ax_default _默认样式" selectiongroup="选项组8">
          <div id="u5559_div" class=""></div>
          <div id="u5559_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5560" class="ax_default" data-left="600" data-top="427" data-width="237" data-height="30">

        <!-- Unnamed (Rectangle) -->
        <div id="u5561" class="ax_default _默认样式 selected" selectiongroup="选项组9">
          <div id="u5561_div" class="selected"></div>
          <div id="u5561_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5562" class="ax_default _默认样式" selectiongroup="选项组9">
          <div id="u5562_div" class=""></div>
          <div id="u5562_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5563" class="ax_default _默认样式" selectiongroup="选项组9">
          <div id="u5563_div" class=""></div>
          <div id="u5563_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5564" class="ax_default _默认样式" selectiongroup="选项组9">
          <div id="u5564_div" class=""></div>
          <div id="u5564_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5565" class="ax_default _默认样式">
        <div id="u5565_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5566" class="ax_default _默认样式">
        <div id="u5566_div" class=""></div>
        <div id="u5566_text" class="text ">
          <p><span>禁用样式</span></p>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5567" class="ax_default" data-left="40" data-top="768" data-width="317" data-height="35">

        <!-- Unnamed (Rectangle) -->
        <div id="u5568" class="ax_default _默认样式 selected" selectiongroup="选项组3">
          <div id="u5568_div" class="selected"></div>
          <div id="u5568_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5569" class="ax_default _默认样式 disabled" selectiongroup="选项组3">
          <div id="u5569_div" class="disabled"></div>
          <div id="u5569_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5570" class="ax_default _默认样式" selectiongroup="选项组3">
          <div id="u5570_div" class=""></div>
          <div id="u5570_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5571" class="ax_default _默认样式" selectiongroup="选项组3">
          <div id="u5571_div" class=""></div>
          <div id="u5571_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5572" class="ax_default" data-left="40" data-top="828" data-width="317" data-height="35">

        <!-- Unnamed (Rectangle) -->
        <div id="u5573" class="ax_default _默认样式 selected" selectiongroup="选项组4">
          <div id="u5573_div" class="selected"></div>
          <div id="u5573_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5574" class="ax_default _默认样式 disabled" selectiongroup="选项组4">
          <div id="u5574_div" class="disabled"></div>
          <div id="u5574_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5575" class="ax_default _默认样式" selectiongroup="选项组4">
          <div id="u5575_div" class=""></div>
          <div id="u5575_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5576" class="ax_default _默认样式" selectiongroup="选项组4">
          <div id="u5576_div" class=""></div>
          <div id="u5576_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5577" class="ax_default _默认样式">
        <div id="u5577_div" class=""></div>
        <div id="u5577_text" class="text ">
          <p><span>气泡样式</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5578" class="ax_default _默认样式">
        <div id="u5578_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u5579" class="ax_default _默认样式">
        <div id="u5579_div" class=""></div>
        <div id="u5579_text" class="text ">
          <p><span>圆角边框样式</span></p>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5580" class="ax_default" data-left="40" data-top="540" data-width="317" data-height="35">

        <!-- Unnamed (Rectangle) -->
        <div id="u5581" class="ax_default _默认样式 selected" selectiongroup="选项组5">
          <div id="u5581_div" class="selected"></div>
          <div id="u5581_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5582" class="ax_default _默认样式" selectiongroup="选项组5">
          <div id="u5582_div" class=""></div>
          <div id="u5582_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5583" class="ax_default _默认样式" selectiongroup="选项组5">
          <div id="u5583_div" class=""></div>
          <div id="u5583_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5584" class="ax_default _默认样式" selectiongroup="选项组5">
          <div id="u5584_div" class=""></div>
          <div id="u5584_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u5585" class="ax_default" data-left="40" data-top="600" data-width="317" data-height="35">

        <!-- Unnamed (Rectangle) -->
        <div id="u5586" class="ax_default _默认样式 selected" selectiongroup="选项组6">
          <div id="u5586_div" class="selected"></div>
          <div id="u5586_text" class="text ">
            <p><span>杭州</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5587" class="ax_default _默认样式" selectiongroup="选项组6">
          <div id="u5587_div" class=""></div>
          <div id="u5587_text" class="text ">
            <p><span>上海</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5588" class="ax_default _默认样式" selectiongroup="选项组6">
          <div id="u5588_div" class=""></div>
          <div id="u5588_text" class="text ">
            <p><span>北京</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u5589" class="ax_default _默认样式" selectiongroup="选项组6">
          <div id="u5589_div" class=""></div>
          <div id="u5589_text" class="text ">
            <p><span>成都</span></p>
          </div>
        </div>
      </div>

      <!-- 点击选择器1 (Dynamic Panel) -->
      <div id="u5590" class="ax_default" data-label="点击选择器1">
        <div id="u5590_state0" class="panel_state" data-label="State1" style="">
          <div id="u5590_state0_content" class="panel_state_content">

            <!-- 1 (Rectangle) -->
            <div id="u5591" class="ax_default _默认样式 selected" data-label="1" selectiongroup="选项组11">
              <div id="u5591_div" class="selected"></div>
              <div id="u5591_text" class="text ">
                <p><span>1月</span></p>
              </div>
            </div>

            <!-- 2 (Rectangle) -->
            <div id="u5592" class="ax_default _默认样式" data-label="2" selectiongroup="选项组11">
              <div id="u5592_div" class=""></div>
              <div id="u5592_text" class="text ">
                <p><span>2月</span></p>
              </div>
            </div>

            <!-- 3 (Rectangle) -->
            <div id="u5593" class="ax_default _默认样式" data-label="3" selectiongroup="选项组11">
              <div id="u5593_div" class=""></div>
              <div id="u5593_text" class="text ">
                <p><span>3月</span></p>
              </div>
            </div>

            <!-- 4 (Rectangle) -->
            <div id="u5594" class="ax_default _默认样式" data-label="4" selectiongroup="选项组11">
              <div id="u5594_div" class=""></div>
              <div id="u5594_text" class="text ">
                <p><span>4月</span></p>
              </div>
            </div>

            <!-- 5 (Rectangle) -->
            <div id="u5595" class="ax_default _默认样式" data-label="5" selectiongroup="选项组11">
              <div id="u5595_div" class=""></div>
              <div id="u5595_text" class="text ">
                <p><span>5月</span></p>
              </div>
            </div>

            <!-- 6 (Rectangle) -->
            <div id="u5596" class="ax_default _默认样式" data-label="6" selectiongroup="选项组11">
              <div id="u5596_div" class=""></div>
              <div id="u5596_text" class="text ">
                <p><span>6月</span></p>
              </div>
            </div>

            <!-- 7 (Rectangle) -->
            <div id="u5597" class="ax_default _默认样式" data-label="7" selectiongroup="选项组11">
              <div id="u5597_div" class=""></div>
              <div id="u5597_text" class="text ">
                <p><span>7月</span></p>
              </div>
            </div>

            <!-- 8 (Rectangle) -->
            <div id="u5598" class="ax_default _默认样式" data-label="8" selectiongroup="选项组11">
              <div id="u5598_div" class=""></div>
              <div id="u5598_text" class="text ">
                <p><span>8月</span></p>
              </div>
            </div>

            <!-- 气泡 (Speech Bubble) -->
            <div id="u5599" class="ax_default" data-label="气泡">
              <img id="u5599_img" class="img " src="images/______radio_group/气泡_u5599.png"/>
              <div id="u5599_text" class="text ">
                <p><span>购买1月</span></p>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- 点击选择器2 (Dynamic Panel) -->
      <div id="u5600" class="ax_default" data-label="点击选择器2">
        <div id="u5600_state0" class="panel_state" data-label="State1" style="">
          <div id="u5600_state0_content" class="panel_state_content">

            <!-- 1 (Rectangle) -->
            <div id="u5601" class="ax_default _默认样式 selected" data-label="1" selectiongroup="选项组10">
              <div id="u5601_div" class="selected"></div>
              <div id="u5601_text" class="text ">
                <p><span>1天</span></p>
              </div>
            </div>

            <!-- 2 (Rectangle) -->
            <div id="u5602" class="ax_default _默认样式" data-label="2" selectiongroup="选项组10">
              <div id="u5602_div" class=""></div>
              <div id="u5602_text" class="text ">
                <p><span>2天</span></p>
              </div>
            </div>

            <!-- 3 (Rectangle) -->
            <div id="u5603" class="ax_default _默认样式" data-label="3" selectiongroup="选项组10">
              <div id="u5603_div" class=""></div>
              <div id="u5603_text" class="text ">
                <p><span>3天</span></p>
              </div>
            </div>

            <!-- 4 (Rectangle) -->
            <div id="u5604" class="ax_default _默认样式" data-label="4" selectiongroup="选项组10">
              <div id="u5604_div" class=""></div>
              <div id="u5604_text" class="text ">
                <p><span>4天</span></p>
              </div>
            </div>

            <!-- 5 (Rectangle) -->
            <div id="u5605" class="ax_default _默认样式" data-label="5" selectiongroup="选项组10">
              <div id="u5605_div" class=""></div>
              <div id="u5605_text" class="text ">
                <p><span>5天</span></p>
              </div>
            </div>

            <!-- 6 (Rectangle) -->
            <div id="u5606" class="ax_default _默认样式" data-label="6" selectiongroup="选项组10">
              <div id="u5606_div" class=""></div>
              <div id="u5606_text" class="text ">
                <p><span>6天</span></p>
              </div>
            </div>

            <!-- 7 (Rectangle) -->
            <div id="u5607" class="ax_default _默认样式" data-label="7" selectiongroup="选项组10">
              <div id="u5607_div" class=""></div>
              <div id="u5607_text" class="text ">
                <p><span>7天</span></p>
              </div>
            </div>

            <!-- 8 (Rectangle) -->
            <div id="u5608" class="ax_default _默认样式" data-label="8" selectiongroup="选项组10">
              <div id="u5608_div" class=""></div>
              <div id="u5608_text" class="text ">
                <p><span>8天</span></p>
              </div>
            </div>

            <!-- 气泡 (Speech Bubble) -->
            <div id="u5609" class="ax_default" data-label="气泡">
              <img id="u5609_img" class="img " src="images/______radio_group/气泡_u5609.png"/>
              <div id="u5609_text" class="text ">
                <p><span>购买1天</span></p>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Unnamed (版权信息) -->

      <!-- Unnamed (Rectangle) -->
      <div id="u5611" class="ax_default _默认样式">
        <img id="u5611_img" class="img " src="images/___icons/u605.png"/>
        <div id="u5611_text" class="text ">
          <p><span>Copyright © </span><a id="u5612" class="link"><span>http://t.cn/EPh287q</span></a><span>, All Rights Reserved.</span></p><p><span>打造高保真原型，快人一步</span></p>
        </div>
      </div>
    </div>
  </body>
</html>
